작업내용

• 백오피스 구축: 초보자 친화적으로 데이터 입력, 수정, 배치할 수 있는 UI 구현
• 데이터 동적화: 하드 코딩된 정보를 Mongo DB로 이전하고, API를 통해 Main Web에서 주기적으로 불러오도록 변경
• 시스템 최적화: 프론트엔드와 백엔드 간의 타입 공유 및 연도별/기수별 확장이 용이한 구조 설계

포함내용

• 관리 대상 데이터
  − 임원진 정보: 연도, 이름, 직책, 학과, 인터뷰 내용(Markdown), 프로필 이미지 등
  − 대외 링크: 홈페이지, SNS, GitHub 등 링크 종류와 아이콘 식별자 관리
  − FAQ: 카테고리별 질문 및 답변(Rich Text 지원) 관리

• 기술적 구현
  − DB/API: MongoDB(Mongoose) 스키마 설계 및 RESTful API 엔드포인트 구성
  − UX 기능: 드래그 앤 드롭 순서 변경, 실시간 유효성 검사, Markdown/Rich Text 에디터
  − 안정성: Zod를 활용한 타입 안전성 확보 및 Next.js의 ISR을 이용한 렌더링 최적화

기대 효과 및 전략

• 운영 민첩성: 개발자의 코드 수정과 재배포 과정 없이 운영진이 직접 정보를 최신화하여 서비스 자율성 증대
• 확장 가능성: 데이터가 연도/기수별로 누적되므로, 향후 '역대 임원진'이나 '활동 아카이브' 등의 기능으로 확장 용이
• 사용자 경험: API 장애 시에도 UI가 깨지지 않도록 에러 바운더리와 스켈레톤 UI 적용 등 DX와 UX의 조화 강조